function getproduct_list() {
    let localdata = localData("productlist")
    let product_list = localdata.getdata()
    loding_cart(product_list)
}
//加载购物车数据
function loding_cart(data_list) {
    let str = ''
    data_list.forEach(value => {
        str += `<div class="product_item clearfix" data-id='${value.id}'>
        <div class="product_check">
            <input type="checkbox" name='checksingle' id="" ${value.checked==true?'checked':''}  data-id='${value.id}' onclick='checkBoxSingle()'">
        </div>
        <div class="product_img">
            <img src=${value.picture}
                alt="">
        </div>
        <div class="product_name">
            <p>${value.product}</p>
        </div>
        <div class="product_price">
            ${value.price}
        </div>
        <div class="product_num">
            <div class="clearfix">
                <button class="numup" data-id='${value.id}'>-</button>
                <input type="text" data-id='${value.id}' value="${value.num}">
                <button class="numdown" data-id='${value.id}'>+</button>
            </div>

        </div>
        <div class="product_nums">
            ${ (value.num*value.price).toFixed(2)}
        </div>
        <div class="product_delect">
            <button data-id='${value.id}'>×</button>
        </div>
    </div>`
    });
    $(".list_main").html(str)
    input_blur()
    checkBoxSingle()
}
//input输入数量事件
function input_blur() {
    let localdata = localData("productlist")
    $(".product_num input").blur(function (e) {
        let id = $(e.target).attr("data-id")
        let num = parseInt($(e.target).val())
        if (isNaN(num)) {
            $(e.target).val("")
            alert("只能为整数")
            return
        } else {
        localdata.updata(id, {num})
        getproduct_list()
        }
    })
}
//按钮加减事件
function button_event() {
    let maindiv = document.querySelector(".list_main")
    let localdata = localData("productlist")
    maindiv.addEventListener("click", function (e) {
        if ($(e.target).text() == "+") {
            let data = localdata.getbyId($(e.target).attr("data-id"))
            console.log($(e.target).attr("data-id"));
            data.num++
            localdata.updata($(e.target).attr("data-id"), data)
        } else if ($(e.target).text() == "-") {
            let data = localdata.getbyId($(e.target).attr("data-id"))
            console.log($(e.target).attr("data-id"));
            data.num--
            localdata.updata($(e.target).attr("data-id"), data)
        } else if ($(e.target).text() == "×") {
            localdata.delectdata($(e.target).attr("data-id"))
        } else if($(e.target).attr("type")=="checkbox"){
            let checked = e.target.checked
            localdata.updata($(e.target).attr("data-id"),{checked})
            checkBoxSingle()
         }else {
            return
        }
        getproduct_list()
    })
}
function checkbox(){
    let sunnum = 0
    let num=0
    $.each($("input[name='checksingle']"),function(index,value){
        if(value.checked==true){
            num+=parseInt($(`input[data-id=${$(value).attr("data-id")}]`)[1].value)
           sunnum+= parseFloat($(`div[data-id=${$(value).attr("data-id")}] .product_nums`).text()) 
        }
    })
    $('.total_left span').text(num)
    $('.total_right span').text(sunnum.toFixed(2))

}
button_event()
getproduct_list()